<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=Edge">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no" />
		<title>鼎吉驾校</title>
		<meta name="description" content="Yan" />
		<meta name="keywords" content="Yan" />
		<meta name="author" content="Yan" />

		<link rel="stylesheet" type="text/css" href="../static/css/normalize.css" />
		<link rel="stylesheet" type="text/css" href="../static/css/default.css">
		<link rel="stylesheet" href="../static/css/main.css">
		<link rel="stylesheet" href="../static/css/examples.css">
		<!-- Themes -->
		<link rel="stylesheet" href="../static/css/bars-1to10.css">
		<link rel="stylesheet" href="../static/css/bars-movie.css">
		<link rel="stylesheet" href="../static/css/bars-square.css">
		<link rel="stylesheet" href="../static/css/bars-pill.css">
		<link rel="stylesheet" href="../static/css/bars-reversed.css">
		<link rel="stylesheet" href="../static/css/bars-horizontal.css">

		<link rel="stylesheet" href="../static/css/fontawesome-stars.css">
		<link rel="stylesheet" href="../static/css/css-stars.css">
		<link rel="stylesheet" href="../static/css/bootstrap-stars.css">


		<link rel="stylesheet" type="text/css" href="../static/css/reset.css" />
		<link rel="stylesheet" type="text/css" href="../static/css/swiper-3.4.1.min.css" />
		<link rel="stylesheet" type="text/css" href="../static/css/custom.css" />
		<link rel="stylesheet" type="text/css" href="../static/css/iconfont.css" />
		<link rel="stylesheet" type="text/css" href="../static/css/new_add.css" />
		<link rel="stylesheet" type="text/css" href="../static/css/font-awesome.min.css" />
		<link rel="stylesheet" type="text/css" href="../static/css/font-awesome.min.css" />
	</head>

	<style type="text/css">
		/* flexslider */
		.flexslider {
			position: relative;
			height: 200px;
			overflow: hidden;
			/* background: url(../static/images/loading.gif) 50% no-repeat; */
		}

		.slides {
			position: relative;
			z-index: 1;
		}

		.slides li {
			height: 200px;
		}

		.flex-control-nav {
			position: absolute;
			bottom: 10px;
			z-index: 2;
			width: 100%;
			text-align: center;
		}

		.flex-control-nav li {
			display: inline-block;
			width: 14px;
			height: 14px;
			margin: 0 5px;
			*display: inline;
			zoom: 1;
		}

		.flex-control-nav a {
			display: inline-block;
			overflow: hidden;
			cursor: pointer;
			width: 10px;
			height: 10px;
			border-radius: 100%;

			background: #fff;
			color: #fff;
		}

		.flex-control-nav .flex-active {
			background: #0067ff;
			color: #0067ff;
		}

		.flex-direction-nav {
			position: absolute;
			z-index: 3;
			width: 100%;
			top: 45%;
		}

		.flex-direction-nav li a {
			display: block;
			width: 50px;
			height: 50px;
			overflow: hidden;
			cursor: pointer;
			position: absolute;
		}

		.flex-direction-nav li a.flex-prev {
			left: 40px;
			background: url(../static/images/prev.png) center center no-repeat;
		}

		.flex-direction-nav li a.flex-next {
			right: 40px;
			background: url(../static/images/next.png) center center no-repeat;
		}

		.col-xs-3 {
			width: 25%;
		}

		.city {
			width: 90%;
			color: #0067ff;
			height: 30px;
			border: none;
		}

		.mold>div>div {
			line-height: 5rem;
		}

		.mold>div>div a {
			display: block;
			/* line-height: 40px; */
		}

		.c_alert_dialog {
			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			color: #111;
			position: fixed;
			left: 0px;
			top: 0px;
			z-index: 9999;
			width: 100%;
			height: 100%;
			display: -webkit-flex;
			display: flex;
			-webkit-align-items: center;
			align-items: center;
			-webkit-justify-content: center;
			justify-content: center;
		}

		.c_alert_mask {
			position: absolute;
			left: 0;
			top: 0px;
			width: 100%;
			height: 100%;
			z-index: 505;
			background: rgba(0, 0, 0, .78);
			-webkit-transition: all .5s ease;
			opacity: 1;
			visibility: initial;
		}

		.c_alert_width.c_alert_wrap {
			padding: 10px 0 0 0;
			box-sizing: border-box;
			width: 80%;
			z-index: 1200;
			max-width: 400px;
			position: relative;
			background: #fff;
			height: auto;
			border-radius: 10px;
			overflow: hidden;
			box-shadow: 0 2px 20px rgba(0, 0, 0, .25);
			font-size: 15px;
			opacity: 1;
			-webkit-animation-duration: 1s;
			animation-duration: 1s;
			-webkit-animation-timing-function: linear;
			animation-timing-function: linear;
			-webkit-animation-fill-mode: forwards;
			animation-fill-mode: forwards;
			-webkit-animation-name: anim-open;
			animation-name: anim-open;
		}

		.c_alert_title {
			padding: 5px 15px 10px 15px;
			line-height: 1;
			margin-bottom: -2px;
			text-align: left;
			font-weight: bold;
			font-size: 16px;
			position: relative;
		}

		.c_alert_btn {
			border-top: 1px solid #e7e7e7;
			overflow: hidden;
			display: -webkit-flex;
			display: flex;
			-webkit-align-items: center;
			align-items: center;
			-webkit-justify-content: center;
			justify-content: center;
		}

		.c_alert_btn a {
			font-weight: bold;
			line-height: 1;
			text-align: center;
			color: #0067ff;
			text-decoration: none;
			-webkit-appearance: none;
			-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
			display: block;
			padding: 13px 0;
			font-size: 16px;
			margin: 0;
			background: 0 0;
			border: none;
			border-radius: 0;
			letter-spacing: 1px;
			cursor: pointer;
			border-left: 1px solid #e7e7e7;
			width: 100%;
			transition: all .2s ease;
			-webkit-transition: all .2s ease;

		}

		.c_alert_con {
			text-align: left;
			font-size: 15px;
			line-height: 1.4;
			color: #444;
			padding: 12px 10px;
		}

		.mold input {
			margin-right: 5px;
		}

		.mold label {
			margin-right: 10px;
			display: flex;
			justify-content: space-between;
			line-height: 1.5rem;
		}

		.col-xs-3 {
			width: 20%;
		}

		.nav-bar-item img {
			width: 50px;
			height: 50px;
		}

		.flex-prev,
		.flex-next {
			display: none !important;
		}
	</style>
	<body>
		<!--[if lt IE 9]>对不起，浏览器版本太低~！<![endif]-->

		<div class="container">
			<div class="flexslider">
				<ul class="slides">

				</ul>
			</div>


			<div class="row nav-bar">
				<div class="col-xs-3 nav-bar-item">
					<a href="../page/index.html?id=6"><img src="" data-src="../static/images/vrxc.png" /><i>学车流程</i></a>
				</div>
				<div class="col-xs-3 nav-bar-item">
					<a href="../page/index.html?id=7"><img src="" data-src="../static/images/qbjl.png" /><i>优势服务</i></a>
				</div>
				<div class="col-xs-3 nav-bar-item">
					<a href="../page/index.html?id=8"><img src="" data-src="../static/images/fwys.png" /><i>学车保障</i></a>
				</div>
				<div class="col-xs-3 nav-bar-item">
					<a href="../page/index.html?id=9"><img src="" data-src="../static/images/qbcd.png" /><i>常见问题</i></a>
				</div>
				<div class="col-xs-3 nav-bar-item">
					<a href="../enlist/test.html"><img src="" data-src="../static/images/vrxc.png" /><i>体检申请</i></a>
				</div>

			</div>

			<div class="row mold">
				<h1 class="col-xs-12" id="select-city">
					<div class="form-group">
						<span class="fa fa-map-marker"></span>
						<!-- <img src="../static/images/map.png" width="20" /> -->
						<span style="color:#0067ff;" id="text">加载中...</span>
						<span style="color:#0067ff;float: right"> > </span>
					</div>
				</h1>
				<div class="c_alert_dialog dialog_open" style="display: none">
					<div class="c_alert_mask" ontouchmove="return false"></div>
					<div class="c_alert_wrap c_alert_width">
						<div class="c_alert_title">请选择报名区域</div>
						<div class="c_alert_con" id="area">


						</div>
						<div class="c_alert_btn">
							<a href="javascript:;" id="confirm" data-name="确定">确定</a>
						</div>
					</div>
				</div>




				<div class="col-xs-12" id="course_list">
					<!-- {volist name="grade" id="item"}
					<div class="col-xs-12">
						<a href="../enlist/detail.html?id=item.id">{$item.name}C{$item.type}<span class="right">{$item.price}</span></a>
					</div>
					{/volist} -->

				</div>
			</div>

			<div class="kong row"></div>

		</div>

	</body>
	<script charset="GBK" src="http://map.qq.com/api/js?v=2.exp"></script>
	<script>
		/*
    function test(){
        $.post("{$web_path}/enlist/get_sign",function(data){
            data = eval("("+data+")");
            if(data.code=="400"){
                alert(data.msg);
            }else{
                location.href="../enlist/test.html.html";
            }
        });
    }*/
	</script>




	<div class="footer">
		<a class="col-xs-4" href="../index/index.html">
			<i class="iconfont icon-fangxiangpan"></i>
			<p>首页</p>
		</a>
		<a class="col-xs-4 active" href="../enlist/index.html">
			<i class="iconfont icon-baoming"></i>
			<p>报名</p>
		</a>
		<a class="col-xs-4" href="../user/index.html">
			<i class="iconfont icon-wode"></i>
			<p>我的</p>
		</a>
	</div>
	<div id="container"></div>

	<script src="../static/js/jquery-2.2.3.min.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=DBd897f58d7a63e585485e3dea011253"></script>
	<script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
	<script src="../static/js/custom1.js" type="text/javascript" charset="utf-8"></script>
	<script src="../static/js/apiRoot.js" type="text/javascript" charset="utf-8"></script>
	<script src="api.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript" src="../static/js/jquery.flexslider-min.js"></script>
	<script src="../static/js/lazy-load-img.js" type="text/javascript" charset="utf-8"></script>
	<script src="../static/js/lazy-load.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		$(document).ready(function() {
			index();

			let garetextid = JSON.parse(sessionStorage.getItem("garetext"))
			if (garetextid != null && garetextid != "null" && garetextid != undefined && garetextid != "" && garetextid !=
				"undefined") {
				get_list(garetextid.garetextid);
				$("#text").html(garetextid.garetextname);
				area();
				for (var i = 0; i < $('input:radio[name="city"]').length; i++) {
					if ($('input:radio[name="city"]').eq(i).val() == garetextid.garetextid) {
						$('input:radio[name="city"]').eq(i).attr("checked", true);
					}
				}
			} else {

				get_area();
			}
			$("#select-city").click(function() {
				$(".dialog_open").show();
			});
			$("#close").click(function() {
				$(".dialog_open").hide();
			});
			$("#confirm").click(function() {
				//获取选中的值
				var city = $('input:radio[name="city"]:checked').val();
				if (city == null) {
					alert("请选择一个区域");
					return false;
				}
				get_list(city);
				$(".dialog_open").hide();
				var text = $('input:radio[name="city"]:checked')[0].nextSibling.nodeValue;
				$("#text").html(text);

				sessionStorage.setItem("garetext", JSON.stringify({
					"garetextid": city,
					"garetextname": text
				}))
			});
			$("#city").change(function() {

				var city = $(this).val();
				get_list(city);
			});

			function get_list(city) {
				let ajaxdata = {
					area_id: parseInt(city)
				};
				let data = ajaxPost(sign_get_grade, ajaxdata)
				let src = "";
				if (data.data != null && data.data.length != 0) {

					for (var i = 0; i < data.data.length; i++) {

						src += "<div class='col-xs-12'>" +
							"<a href='../enlist/detail.html?id=" + data.data[i].id + "'>" + data.data[i].name + "C" + data.data[i].type +
							"<span class='right'>" + data.data[i].price + "</span></a>" +
							"</div>";
					}
					$("#course_list").html(src);
				} else {
					$("#course_list").empty();
					$("#course_list").append('<div class="col-xs-12">暂无数据</div>');
				}
			}






			$('.flexslider').flexslider({
				directionNav: true,
				pauseOnAction: false
			});
		});
	</script>
</html>
